<template>
  <div>
    <el-button type="success" @click="go">Go to Home</el-button>
    <container />
  </div>

</template>

<script setup>
import { onMounted, ref, onBeforeUnmount } from 'vue';
import { useRouter } from 'vue-router';
import container from './container.vue';
import { loadMicroApp } from 'qiankun';
const router = useRouter();
// const microApp = ref(null);

const go = () => {
  router.push({
    path: '/',
  });
}

// onMounted(() => {
//   microApp.value = loadMicroApp(
//     {
//       name: 'reactApp',
//       entry: '//localhost:30001',
//       container: '#container',
//       activeRule: '/vue',
//     }, {
//     sandbox: {
//       experimentalStyleIsolation: true, // 启用实验性样式隔离
//     },
//   });


// })

// onBeforeUnmount(() => {
//   microApp.value.unmount();
//   microApp.value = null;
// });

</script>

<style>
#container {
  height: 50vh;
  width: 100%;
  background-color: #f0f0f0;
  border: 1px solid #dcdcdc;
  overflow: auto;
}
</style>
